﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="wfSubmitOrders.aspx.cs" Inherits="msBsc.WebUi.wMall.Seller.wfSubmitOrders" %>

<!DOCTYPE html>


<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>提交订单</title>
    <link href="/themes/wStyle1/css/sLayout.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sHead.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sFoot.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/from.css" rel="stylesheet" />
    <link href="/jqPlugin/laydate/skins/default/laydate.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/Seller/menu.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sOrderInfo.css" rel="stylesheet" />
</head>
<body>
    <div class="wf_all">
        <input type="hidden" id="vehicleId" />
        <input type="hidden" id="djackId" />
        <div id="divLoginInfo">
            <%=msBsc.WebUi.Code.QtHtmlGet.GetHeaderLoginInfo() %>
        </div>
        <div class="main-container">
            <div class="main-Info">
                <div class="main-horizontal">
                    <h2>下订单</h2>
                    <table class="table">
                        <thead>
                            <tr>
                                <th>
                                    <div class="online" id="online">
                                        在线联系
                                    <img src="/themes/wStyle1/Images/Public/btnChat.png" />
                                    </div>
                                </th>
                                <th>服务时间
                                </th>
                                <th>额外价格(￥)</th>
                                <th>车辆价格(￥)</th>
                                <th>总价(￥)</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="td_Online">
                                    <div class="userImg">
                                        <img id="usermg" src="/UpLoad/Djack/djack.jpg" />
                                    </div>
                                    <div class="userName"><a target="_blank" id="djackName">买家昵称</a></div>
                                </td>
                                <td class="td_tiem">
                                    <div>
                                        起
                                        <input type="text" class="laydate-icon" id="start" />
                                    </div>
                                    <div style="margin-top: 5px">
                                        终
                                        <input type="text" class="laydate-icon" id="end" />
                                    </div>
                                </td>
                                <td class="tdsub_price"><span class="subtotal">0.00</span></td>
                                <td class="tdv_price"><span class="subtotal" id="t_vsub">0.00</span></td>
                                <td class="tdsum_price"><span class="tdTotalPrice" id="t_order_sum">0.00</span></td>
                            </tr>
                        </tbody>
                    </table>
                    <table class="table" style="margin-top: 13px">
                        <thead>
                            <tr>
                                <th></th>
                                <th>车辆</th>
                                <th>单价(￥/天)</th>
                            </tr>
                        </thead>
                        <tbody id="c_vehicleList">
                            <tr>
                                <td class="tdVehicleImg">
                                    <div class="vehicle">
                                        <img class="v_img" data-value="" src="/UpLoad/vehicle/BBB111(3502).jpg" />
                                    </div>
                                </td>
                                <td class="tdVehicleContent">
                                    <div class="vehicleInfo"><a target="_blank" class="vehicleName v_name">车辆名</a></div>
                                    <div class="vehicleInfo"><span>颜色:</span><span class="v_color">黑色</span></div>
                                    <div class="vehicleInfo"><span>车牌号:</span><span class="v_number">dasfdf</span></div>
                                </td>
                                <td><span class="vehiclePrice v_price">228.00</span></td>
                            </tr>
                        </tbody>
                    </table>
                    <div class="vehileSubtotal">
                        <div class="addVehicle">
                            <div class="btn_Add_vehicle" onclick="addVehicle()">添加车辆</div>
                        </div>
                        <div class="vs_content"><span class="v_sub_Name">车辆小计:</span><span id="vehileSubtotal" class="tdTotalPrice">600</span></div>
                        <div class="clear"></div>
                    </div>
                    <div class="AdditionalServices">
                        <div class="ads_title">额外服务:</div>
                        <div class="ads_Content">
                            <textarea class="input ads_Txt_Content" id="o_service">asdf</textarea>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="vehileSubtotal">
                        <span class="v_sub_Name">额外价格:</span><span id="Span1" class="tdTotalPrice">0.00</span>
                    </div>
                    <div class="divSumPrice"><span>实付款：</span><span class="tdTotalPrice" id="o_total">400</span></div>
                    <div class="divBtn">
                        <input type="button" class="btnSubOrder" onclick="submitOrder()" value="提交订单" />
                    </div>
                </div>
            </div>
        </div>
        <div class="ui-mask"></div>
        <div id="altContent">
            <table class="tableList">
                <thead>
                    <tr>
                        <th>
                            <span class="ok_vehicle">[确认]</span>
                        </th>
                        <th></th>
                        <th>车辆</th>
                        <th>价格(元/天)</th>
                    </tr>
                </thead>
            </table>
            <div class="scr_vlist" style="">
                <table class="tableList">
                    <tbody id="tl_vlist">
                        <tr>
                            <td colspan="4">正在加载地接客车辆信息...</td>
                        </tr>

                    </tbody>
                </table>
            </div>
            <xmp id="svc_list_temp" style="display: none">
             {{#for(var i=0,len=d.length;i < len;i++){ }}
             <tr>
                                <td class="tdVehicleImg">
                                    <div class="vehicle">
                                        <img class="v_img" data-value="{{d[i].v_Id}}" src="{{d[i].v_PIC}}" />
                                    </div>
                                </td>
                                <td class="tdVehicleContent">
                                    <div class="vehicleInfo"><a target="_blank" class="vehicleName v_name">{{d[i].v_Name}}</a></div>
                                    <div class="vehicleInfo"><span>颜色:</span><span class="v_color">{{d[i].v_Color}}</span></div>
                                    <div class="vehicleInfo"><span>车牌号:</span><span class="v_number">{{d[i].v_Code}}</span></div>
                                </td>
                                <td><span class="vehiclePrice v_price">{{d[i].v_Price}}</span></td>
                            </tr>
            {{#} }}
                           </xmp>
            <xmp id="svc_list_temp_vehicle" style="display: none">
             {{#for(var i=0,len=d.rows.length;i < len;i++){ }}
              <tr>
                        <td class="checkbox">
                            <input type="checkbox" name="v_info" data-value="{{d.rows[i].VEHICLE_INFO_ID}}" /></td>
                        <td class="tl_vimg">
                                <img src="http://www.dijieke.com/Filters/Car/{{d.rows[i].VEHICLE_DEFAULT_PIC}}" />
                        </td>
                        <td class="tl_vName"><span class="vehicleName">{{d.rows[i].VEHICLE_NAME}}</span>
                            <input type="hidden" class="tl_vNumber" value="{{d.rows[i].VEHICLE_CODE}}" />
                            <input type="hidden" class="tl_vColor" value="{{d.rows[i].VEHICLE_COLOR}}" />
                        </td>
                        <td class="tl_vPrice">{{d.rows[i].VEHICLE_PRICE_DAY}}</td>
                    </tr>
                                
            {{#} }}
                           </xmp>
            <span class="close" id="colseHeadPhoto">&times;</span>
        </div>
        <!--start JS引用-->
        <script src="/jqPlugin/js/jquery-1.8.3.min.js"></script>
        <script src="/jqPlugin/js/jBase.js"></script>
        <script src="/jqPlugin/js/jBPage.js"></script>
        <script src="/jqPlugin/js/laytpl.js"></script>
        <script src="/jqPlugin/js/jquery.nicescroll.js"></script>
        <script src="/jqPlugin/assets/bootstrap/js/bootstrap.js"></script>
        <script src="/jqPlugin/laydate/laydate.js"></script>
        <script src="/themes/wStyle1/js/comm/VerifyJs.js"></script>
        <script src="/themes/wStyle1/js/comm/DateInfo.js"></script>
        <!--end JS引用-->
        <script type="text/javascript">
            var start = {
                elem: '#start',
                format: 'YYYY/MM/DD hh:mm',
                min: laydate.now(), //设定最小日期为当前日期
                max: '2099-06-16 23:59:59', //最大日期
                istime: true,
                istoday: false,
                choose: function (datas) {
                    end.min = datas; //开始日选好后，重置结束日的最小日期
                    end.start = datas //将结束日的初始值设定为开始日
                }
            };
            var end = {
                elem: '#end',
                format: 'YYYY/MM/DD hh:mm',
                min: laydate.now(),
                max: '2099-06-16 23:59:59',
                istime: true,
                istoday: false,
                choose: function (datas) {
                    start.max = datas; //结束日选好后，重置开始日的最大日期
                }
            };
            laydate(start);
            laydate(end);

            (function () {
                $("#vehicleId").val(GetQueryStr("vehicleId"));
                $(".close").live("click", function () {
                    close();
                });
                $(".ok_vehicle").live("click", function () {
                    oKCheckVehicle();
                });
            })();

            function btnDo(sEbtn) {
                GtGrid1Action = sEbtn;
                var opart = GetGtParam();
                if (sEbtn == "init") {
                    opart.AddCell("vehicleId", $("#vehicleId").val());
                }
                else if (sEbtn == "getVehicle") {
                    opart.AddCell("djackId", $("#djackId").val());
                }
                ajaxComm(opart);
            };

            //执行AJAX调用时获取参数
            function GetGtParam() {
                var _jsParam = new jsonRow();
                _jsParam.AddCell("ACTION", GtGrid1Action);
                return _jsParam;
            };
            btnDo("init");

            function init(data) {
                $("#usermg").attr("src", "http://www.dijieke.com/Filters/Djack/" + data.rows[0].CUSTOMER_DEFAULT_PIC);
                $("#djackName").text(data.rows[0].CUSTOMER_NICK);
                $("#djackName").attr("href", "/wp_DjackInfo.htm?djackId=" + data.rows[0].DJACK_ID);
                $("#djackId").val(data.rows[0].DJACK_ID);
                $(".v_img").attr("src", "http://www.dijieke.com/Filters/Car/" + data.rows[0].VEHICLE_DEFAULT_PIC);
                $(".v_img").attr("data-value", data.rows[0].VEHICLE_INFO_ID);
                $(".v_name").text(data.rows[0].VEHICLE_NAME);
                $(".v_number").text(data.rows[0].VEHICLE_CODE);
                $(".v_color").text(data.rows[0].VEHICLE_COLOR_NAME);
                $(".v_price").text(data.rows[0].VEHICLE_PRICE_DAY);
                $("#vehileSubtotal").text(data.rows[0].VEHICLE_PRICE_DAY);
                $("#t_vsub").text(data.rows[0].VEHICLE_PRICE_DAY);
                $("#t_order_sum").text(data.rows[0].VEHICLE_PRICE_DAY);
                $("#o_total").text(data.rows[0].VEHICLE_PRICE_DAY);
            }

            //选择已选择的车辆
            function checkVehicle() {
                $.each($(".v_img"), function (i, item) {
                    var v_Id = $(this).attr("data-value");
                    $("#tl_vlist input[type=checkbox][name=v_info][data-value=" + v_Id + "]").attr("checked", "checked");
                })
            }

            function oKCheckVehicle() {
                var v_list = $("#tl_vlist input[type=checkbox][name=v_info]:checked");
                if (v_list.length < 1) {
                    alert("至少选择一辆车辆");
                    return;
                }
                var v_array = new Array();
                for (var i = 0; i < v_list.length; i++) {
                    var vjson = {
                        "v_Id": $(v_list[i]).attr("data-value"),
                        "v_PIC": $(v_list[i]).parents(".checkbox").siblings(".tl_vimg").children("img").attr("src"),
                        "v_Name": $(v_list[i]).parents(".checkbox").siblings(".tl_vName").children(".vehicleName").text(),
                        "v_Code": $(v_list[i]).parents(".checkbox").siblings(".tl_vName").children(".tl_vNumber").val(),
                        "v_Color": $(v_list[i]).parents(".checkbox").siblings(".tl_vName").children(".tl_vColor").val(),
                        "v_Price": $(v_list[i]).parents(".checkbox").siblings(".tl_vPrice").text()
                    };
                    v_array.push(vjson);
                }
                var _html = $('#svc_list_temp').html();
                laytpl(_html).render(v_array, function (render) {
                    $('#c_vehicleList').html(render);
                });
                close();
                computingPrice();
            }

            //计算价格
            function computingPrice() {
                var startTime = $("#start").val();
                var stopTime = $("#end").val();

                var sTime = new Date(startTime);
                var tTime = new Date(stopTime);
                var tNum = parseInt(tTime.getTime() - sTime.getTime()) / 1000 / 60 / 60 / 24;
                var total = 0.00;
                if (tNum < 1) {
                    tNum = 1;
                }
                $.each($(".v_price"), function (i, item) {
                    var s_price = $(this).text();
                    total += tNum * parseFloat(s_price);
                });
                $("#vehileSubtotal").text(total);
                $("#t_vsub").text(total);
                $("#t_order_sum").text(total);
                $("#o_total").text(total);
            }

            function addVehicle() {
                $(".ui-mask").show();
                $("#altContent").show();
                btnDo("getVehicle");
                $(".scr_vlist").niceScroll({ styler: "fb", cursorcolor: "#ff9900", cursorwidth: '5', cursorborderradius: '0px', background: '#4A8BC2', cursorborder: '' });
            }
            function close() {
                $(".ui-mask").hide();
                $("#altContent").hide();
            }

            function submitOrder() {
                var vIds = "";
                $.each($(".v_img"), function (i, item) {
                    if (i > 0) {
                        vIds += "|";
                    }
                    var v_Id = $(this).attr("data-value");
                    vIds += v_Id + ",1";
                });
                if (IsNull(vIds)) {
                    alert("请选择车辆");
                    return;
                }
                var startTime = $("#start").val();
                if (IsNull(startTime)) {
                    alert("请选择开始服务时间");
                    return;
                }
                var stopTime = $("#end").val();
                if (IsNull(stopTime)) {
                    alert("请选择结束服务时间");
                    return;
                }
                var o_service = $("#o_service").val();
                var opart = new jsonRow();
                opart.AddCell("ACTION", "setOrder");
                opart.AddCell("oIds", vIds);
                opart.AddCell("startTime", startTime);
                opart.AddCell("stopTime", stopTime);
                opart.AddCell("service", o_service);
                ajaxComm(opart);
            }
        </script>
        <%=msBsc.WebUi.Code.QtHtmlGet.GetFloorHtml() %>
    </div>
</body>
</html>
